<template>
	<view class="box">
		<view class="img-box">
			<view class="image"></view>
		</view>
		<view class="zhong">
			<img src="@/static/image/cheng.png" alt="" class="phort"/>
			<img src="@/static/image/cheng.png" alt="" class="phort"/>
			<img src="@/static/image/big.png" alt="" class="phort"/>
		</view>
		<!-- 推荐课程 -->
		<view class="fles">
			<view class="recom">推荐课程</view>
			<view class="num">全部52个课程 ></view>
		</view>
		<!-- 推荐课程具体 -->
		<view class="big">
			<view class="rumeng" v-for="(item,index) in newData" :key="index">
				<view>
					<img :src="'http://apis.90000p.com/fkm/upload/'+item.teacherPhoto" alt="" class="ru-img"/>
					<view class="popi">{{item.name}}</view>
				</view>
				
			</view>
		</view>
		
		<!-- 今日课程 -->
		<view class="new">
			<view class="fles">
				<view class="recom">今日课程</view>
				<view class="num">全部52个课程 ></view>
			</view>
			
			<view class="today">
				
				<view class="al-box" v-for="(item,index) in fromData" :key="index">
					<view class="all">
						<img :src="'http://apis.90000p.com/fkm/upload/'+item.photo" alt="" class="toimg">
					</view>
					<view class="indepen">
						<view class="dence">{{item.name}}</view>
						<view class="shop">{{item.address}}</view>
						<view class="time"> {{item.courseEndTime.slice(11,16)}}-{{item.courseStartTime.slice(11,16)}}</view>
					</view>
					<view class="btn">预约</view>
				</view>
				
				
				
				
			</view>
		</view>
	</view>
</template>

<script>
	import {coursesList} from '@/apis/index.js'
	export default {
		data() {
			return {
				query:{
					page:1,
					psize:4,
					type:1,
				},
				newData:[],
				from:{
					page:1,
					psize:20,
				},
				fromData:[],
				pageCounts:1
			};
		},
		onLoad() {
			this.getcoursesList()
			this.getcour()
		},
		onReachBottom() {
			this.from.page++;
			if(this.from.page>this.pageCounts){
				return uni.showToast({
						title: '没有更多数据了',
						icon: 'error'
					})
			}
			this.getcour()
		},
		onPullDownRefresh() {
			this.from.page=1
			this.getcour()
			uni.stopPullDownRefresh()
		},
		methods:{
			async getcoursesList(){
				let res =await coursesList(this.query)
				this.newData = res.data.list
				console.log(res);
			},
			async getcour(){
				let res =await coursesList(this.from)
				this.fromData = this.from.page==1?res.data.list:[...this.fromData,...res.data.list]
				this.pageCounts = res.data.pageCounts
				
				console.log(111,res);
			},
		}
	}
</script>

<style lang="less">
@import url('@/static/fitness.less');
</style>
